<template>
	<view class="bg-white" :style="{ marginTop: source.margin + 'px', marginBottom: source.margin2 + 'px' }">
		<view class="head solid-bottom" v-if="source.is_show_title">{{ source.title }}</view>
		<swiper class="slidenav margin-top-sm" :display-multiple-items="4">
			<swiper-item v-for="(item, index) in source.img_list" :key="index">
				<view class="item">
					<wx-auth :type="1" :link="item"></wx-auth>
					<view class="img" :style="{ backgroundImage: 'url('+ item.url +')' }"></view>
				</view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	export default {
		props: {
			source: [Object]
		}
	}
</script>

<style lang="less" scoped>
@import '../../../common/styles/variables.less';
.head { 
	text-align: center;
	font-size: @title;
	 height: @height;
	 line-height: @height;
}	
.slidenav {
	height: 180upx;
	.item {
		margin: 0 10upx;
		position: relative;
		image {
			width: 100%;
		}
		.img { .combackground(cover, center,top);height: 170upx; }
		.name { font-size: @minSize;text-align: center; }
	}
}	
</style>
